<template>
  <uni-popup ref="popup" type="bottom" safeArea backgroundColor="#fff">
    <view class="flex-col">
      <view style="margin: 20rpx">
        <uni-forms ref="ruleForm" :model="ruleForm" labelWidth="auto"
                   label-position="top">

          <uni-forms-item label="附件:" name="proceduresAttachmentOss" required
                          :rules="[{required:true, errorMessage: '上传附件',validateTrigger:'bind'}]">
            <image-common :disabled="false" :up-type="2" :limit="5" v-model="ruleForm.proceduresAttachmentOss"/>
          </uni-forms-item>

          <uni-forms-item label="说明:">
            <uni-easyinput type="textarea" v-model="ruleForm.proceduresRemark" :maxlength="500" placeholder="请输入说明"/>
          </uni-forms-item>
        </uni-forms>

      </view>
      <view class="button-container">
        <button class="btn-item" @click.stop="submit">提 交</button>
      </view>
    </view>
  </uni-popup>
</template>

<script>
import * as apis from '@/api/routineHandle'

export default {
  name: 'procedure',//提交手续
  computed: {},
  watch: {
    'ruleForm.proceduresAttachmentOss': {
      handler(val) {
        if (val) {
          this.$refs.ruleForm.clearValidate('contractOss');
        }
      },
      immediate: true,
      deep: true
    }
  },
  data() {
    return {
      ruleForm: {
        vehicleDisposalId: null,
        vehicleDisposalNo: null,
        proceduresAttachmentOss:undefined,
        paymentVoucherRemark:''
      },
    };
  },
  created() {
  },
  mounted() {
  },
  methods: {
    open(row) {
      this.$refs.popup.open()
      this.ruleForm = {
        vehicleDisposalId: null,
        vehicleDisposalNo: null,
        proceduresAttachmentOss:undefined,
        paymentVoucherRemark:''
      }
      this.ruleForm.vehicleDisposalId = row.vehicleDisposalId
      this.ruleForm.vehicleDisposalNo = row.vehicleDisposalNo
    },

    async submit() {
      try {
        await this.handleEffect()
        const res = await apis?.submitProcedures(this.ruleForm)
        if (res.code === 200) {
          this.$refs.popup.close()
          this.$modal.msgSuccess("提交成功");
          this.$emit('success')
        }
      } catch (e) {
        console.error(e)
      }
    },

    handleEffect() {
      return new Promise((resolve, reject) => {
        this.$refs.ruleForm.validate().then((res) => {
          resolve();
        }).catch((err) => {
          reject(err);
        });
      });
    },
  },
};
</script>

<style scoped lang=""></style>


